<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('新增随手记')"/>
    <th:block th:include="include :: summernote-css"/>
    <th:block th:include="include :: summernote-emoji-css"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-note-add">
        <div class="form-group">
            <label class="col-sm-2 control-label is-required">标题：</label>
            <div class="col-sm-10">
                <input name="noteTitle" class="form-control" type="text" required>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label is-required">内容：</label>
            <div class="col-sm-10">
                <input type="hidden" class="form-control" name="noteContent">
                <div class="summernote" id="noteContent"></div>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">摘要：</label>
            <div class="col-sm-10">
                <input name="noteSummary" class="form-control" type="text">
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label is-required">类型：</label>
            <div class="col-sm-10">
                <label class="radio-box">
                    <input type="radio" name="noteType" id="-1" value="-1" required
                    > 动态</input>
                </label>

                <div class="radio-box" th:each="dict : ${@dict.getType('note_type')}">
                    <input type="radio" th:id="${'noteType_' + dict.dictCode}" name="noteType"
                           th:value="${dict.dictValue}" th:checked="${dict.default}" required>
                    <label th:for="${'noteType_' + dict.dictCode}" th:text="${dict.dictLabel}"></label>
                </div>
                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 在数据字典添加 note_type</span>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label is-required">发布形式：</label>
            <div class="col-sm-10">
                <label class="radio-box">
                    <input name="isPublic" type="radio" id=0 value=0 required th:checked="true"> 公 开</input>
                </label>
                <label class="radio-box">
                    <input name="isPublic" type="radio" id=1 value="1" required> 私 密(仅自己可见)</input>
                </label>
            </div>
        </div>

    </form>
</div>
<th:block th:include="include :: footer"/>
<th:block th:include="include :: summernote-js"/>
<th:block th:include="include :: summernote-emoji-js"/>
<script th:inline="javascript">
    var prefix = ctx + "emmanuel/noteBoard";
    $("#form-note-add").validate({
        focusCleanup: true
    });

    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/add", $('#form-note-add').serialize());
        }
    }

    $(function () {
        document.emojiSource = '/ajax/libs/summernote/tam-emoji/img';
        $('.summernote').summernote({
            lang: 'zh-CN',
            height: 192,
            dialogsInBody: true,
            dialogsFade: true,  //模态框淡入淡出

            toolbar: [
                ['style', ['style']],
                ['insert', ['emoji']],
                ['font', ['bold', 'underline', 'clear']],
                ['fontname', ['fontname']],
                ['color', ['color']],
                ['para', ['ul', 'ol', 'paragraph']],
                ['table', ['table']],
                ['insert', ['link', 'picture', 'video']],
                ['view', ['fullscreen', 'help']],
            ],
            callbacks: {
                onChange: function (contents, $edittable) {
                    $("input[name='" + this.id + "']").val(contents);
                },

                // 我不需要网络存储图片，如果大家需要可以打开一下代码

                // onImageUpload: function(files) {
                //     var obj = this;
                //     var data = new FormData();
                //     data.append("file", files[0]);
                //     $.ajax({
                //         type: "post",
                //         url: ctx + "common/upload",
                //         data: data,
                //         cache: false,
                //         contentType: false,
                //         processData: false,
                //         dataType: 'json',
                //         success: function(result) {
                //             if (result.code == web_status.SUCCESS) {
                //                 $('#' + obj.id).summernote('insertImage', result.url);
                //             } else {
                //                 $.modal.alertError(result.msg);
                //             }
                //         },
                //         error: function(error) {
                //             $.modal.alertWarning("图片上传失败。");
                //         }
                //     });
                // }
            }
        });
    });
</script>
</body>
</html>
